<div style="background: #ececec; padding: 30px; height: 100vh">
  <nz-card
    style="width: 300px; margin: 0 auto"
    [nzBordered]="false"
    nzTitle="登录"
  >
    <form
      nz-form
      [formGroup]="validateForm"
      class="login-form"
      (ngSubmit)="submitForm()"
    >
      <nz-form-item>
        <nz-form-control nzErrorTip="请输入邮箱！">
          <nz-input-group [nzPrefix]="prefixIconUser">
            <input
              type="text"
              nz-input
              formControlName="email"
              placeholder="邮箱"
            />
          </nz-input-group>
        </nz-form-control>
      </nz-form-item>
      <nz-form-item>
        <nz-form-control nzErrorTip="请输入密码！">
          <nz-input-group [nzPrefix]="prefixIconLock">
            <input
              type="password"
              nz-input
              formControlName="password"
              placeholder="密码"
            />
          </nz-input-group>
        </nz-form-control>
      </nz-form-item>
      <div nz-row class="login-form-margin">
        <div nz-col [nzSpan]="12">
          <label nz-checkbox formControlName="rememberme">
            <span>记住我</span>
          </label>
        </div>
        <div nz-col [nzSpan]="12">
          <a class="login-form-forgot">忘记密码？</a>
        </div>
      </div>
      <button
        nz-button
        class="login-form-button login-form-margin"
        [nzType]="'primary'"
      >
        登录
      </button>
      <a>立即注册 </a>
    </form>
  </nz-card>

  <ng-template #prefixIconUser>
    <i nz-icon nzType="user"></i>
  </ng-template>
  <ng-template #prefixIconLock>
    <i nz-icon nzType="lock"></i>
  </ng-template>
</div>
